<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@ include file="/commons/jsp/taglibs.jsp"%>
<%@taglib uri="http://www.framework.com/taglib" prefix="frame"%>
  <head>
	<title>公共平台 </title>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<!-- 样式文件的引入 -->
	<link href="${ctx}/commons/css/style.css" rel="stylesheet" type="text/css"/>
	<link rel="stylesheet" type="text/css" href="${ctx}/commons/themes/default/easyui.css">
	<link rel="stylesheet" type="text/css" href="${ctx}/commons/themes/icon.css">
	<!-- jqueryUI JS文件的引入 -->
	<script type="text/javascript" src="${ctx}/commons/js/jquery-1.8.0.min.js"></script>
	<script type="text/javascript" src="${ctx}/commons/js/jquery.easyui.min.js"></script>
	<script type="text/javascript" src="${ctx}/commons/js/easyui-extends-validate.js"></script>
	<!-- jqueryUI国际化 -->
	<script type="text/javascript" src="${ctx}/commons/js/easyui-lang-zh_CN.js"></script>
	<!-- 开发使用的公用js方法 -->
	<script type="text/javascript" src="${ctx}/commons/js/common.js"></script>
	<!-- 开发国际化的引用，主要完成后台信息在前台提示的国际化，一定要放在最后 -->
	<script type="text/javascript">var ctx = '${ctx}';var actionExt = "action";var i18n = new Object();</script>
	<script src="${ctx}/commons/js/i18n/message_zh_CN.js" type="text/javascript"></script>
  </head>
  
	<body>
		<div class="easyui-layout" data-options="fit:true,border:false" >	
		   <div data-options="region:'center',border:false" style="padding: 4px;">
			    <table id="listOrderTable" class="easyui-datagrid" 
					data-options="singleSelect:true,toolbar:'#tb',method:'post',rownumbers:true,fit:true,fitColumns:true,border:true,
						pagination:true,remoteSort:true,multiSort:true,striped:true,onLoadSuccess:function(data){$('#'+paramObj.searchID).attr('disabled',false);},
						url:'${ctx }/form/formkey/processlist'"}>
							<thead>
								<tr>
									<th data-options="field:'id',width:20,title:'ID',sortable:true" align="center"></th>
									<th data-options="field:'deploymentId',width:20,title:'DID',sortable:true" align="center"></th>
									<th data-options="field:'name',width:20,title:'名称',sortable:true" align="center"></th>
									<th data-options="field:'key',width:20,title:'KEY',sortable:true" align="center"></th>
									<th data-options="field:'version',width:20,title:'版本号',sortable:true" align="center"></th>
									<th data-options="field:'resourceName',width:20,formatter: getXmlInfo,title:'XML',sortable:true" align="center"></th>
									<th data-options="field:'diagramResourceName',width:20,formatter: getPicture,title:'图片',sortable:true" align="center"></th>
									<th data-options="field:'options',width:20,title:'操作',formatter:getOptionsBtn" align="center"></th>
								</tr>
							</thead>
						</table>
				</table>
			</div>
		</div>
		
		<%--表单--%>
		<div id="processForm">
		</div>
	</body>
	<script type="text/javascript">
	//初始化表格对应的js对象
		var paramObj;
		var d;//对话框
		$(function() {
			//初始化表格对象数据
			paramObj = new initParams(
					{
						paramObjName : 'paramObj',//表格对应的实体对象名称，好区分多个表格情况下的对象
						tableId:'listContentTable',
						addDataFormId:'addContentDataForm',
						showDialogId:'shoContentDialog',
						searchID:'searchContent',
						resetSearchID:'resetSearchContent',
						searchFormID:'searchContentForm',
						updateUrl:'${ctx}/business/webcontent/input?id=',
						deleteUrl:'${ctx}/business/webcontent/remove',
						addDialogWidth:980,
						addDialogHeight:600,
						ctx:'${ctx}',
						addDialogTitle:'文章信息'
					});
		});

		//操作
		function getOptionsBtn(value, row, index){
			var html="<a href='#' pid="+row.id+" onclick='startProcess(this)'>启动</a>";
			
			return html;
		}

		//获取XML信息
		function getXmlInfo(value, row, index){
			return "<a href='${ctx }/workflow/resource/read?processDefinitionId="+row.id+"&resourceType=xml' target='_blank'>"+value+"</a>";
		}

		//获取流程图
		function getPicture(value, row, index){
			return "<a href='${ctx }/workflow/resource/read?processDefinitionId="+row.id+"&resourceType=image' target='_blank'>"+value+"</a>";
		}
		
		/**
		 * 查看流程追踪
		 */	
		 function openProcessTracePicture(id){
			top.$('#firstLevelDialog').dialog({    
			    title:"流程追踪",  
			    iconCls:'icon-view',
			    width: 900,    
			    height: 520,    
			    closed: false,    
			    inline : true,
			    cache: false,    
			    href: "${ctx }/workflow/process/trace?processInstanceId=" + id,    
			    modal: true,
			    buttons : [{
						text:"取消",
						iconCls:'icon-cancel',
						handler:function(){
							top.$('#firstLevelDialog').dialog('close');
						}}]
			});
		}


		/**
		 * 创建模型对话框
		 */	
		function openDataDialog(){
			top.$('#firstLevelDialog').dialog({    
			    title:paramObj.addDialogTitle,  
			    iconCls:'icon-view',
			    width: 600,    
			    height: 300, 
			    closed: false,    
			    inline : true,
			    cache: false,    
			    href: "${ctx }/workflow/model-list-input.jsp",    
			    modal: true,
			    buttons : [{text:paramObj.saveButton,
			    		id:'saveEntityBt',
						iconCls:'icon-ok',
						handler:function(){
							//表单提交
							saveModel();
						}
					},{
						text:paramObj.cancelButton,
						iconCls:'icon-cancel',
						handler:function(){
							top.$('#firstLevelDialog').dialog('close');
						}}]
			});
			//top.$('#firstLevelDialog').dialog("center");
		}

		/**
		 * 读取流程启动表单
		 */
		function startProcess(ti) {
			
			var dialog = $("#processForm");
			var processDefinitionId =$(ti).attr("pid");
			//alert(processDefinitionId);
			// 读取启动时的表单
			$.get('${ctx}/form/formkey/get-form/start/' + processDefinitionId, function(form) {
				// 获取的form是字符行，html格式直接显示在对话框内就可以了，然后用form包裹起来
				
				var html="<form class='formkey-form' method='post' action='${ctx}/form/formkey/start-process/"+processDefinitionId+"'>";
				html+=form+"</form";
				$(dialog).html(html);

				var $form = $('.formkey-form');

				// 设置表单action 和表格样式 、时间控件
				//$form.attr('action', '${ctx}/form/formkey/test');
				$form.find("table").attr("class","infoTable")
				$form.find('.datetime').datetimebox({showSeconds:false});//attr("class","easyui-datetimebox");//
				
				// 表单验证
				//$form.validate($.extend({}, $.common.plugin.validator));
				
				if(d!=null){
					d.dialog("open");
					return;
				}
				
				d=$('#processForm').dialog({
		                title: '启动流程',
					    iconCls:'icon-add',
					    width: 700,    
					    height: 520,    
					    closed: false,    
					    cache: false,  
		                modal: true,
		                buttons: [{
		                    text: '启动',
		                    iconCls: 'icon-ok',
		                    handler: function () {
		                        //提交表单
		                        $('#processForm').dialog('close');
		                        submitProcessForm();
		                    }
		                }, {
		                    text: '取消',
		                    iconCls: 'icon-cancel',
		                    handler: function () {
		                        $('#processForm').dialog('close');
		                    }
		                }]
		        });
				
			});
		}

		//提交表单
		function submitProcessForm(){
			//alert($('.formkey-form').attr("action"));
			//$('.formkey-form').submit();

			$.ajax({
				type: "post",
				timeout:20000,
				url:$('.formkey-form').attr("action"),
				data:$(".formkey-form").serialize(),
				success: function(data){
					top.$.messager.alert('提示',"流程启动成功",'info',function(){window.location.href="${ctx}/workflow/running-manage-list.jsp"});
				},
				error:function(data){
					alert(2);
				}
			});
		}
				
</script>